<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <meta http-equiv="X-UA-Compatible" content="ie=edge">
  <link href="./css/api.css" rel="stylesheet"/>
  <link href="./css/element.css" rel="stylesheet"/>
  <link href="./css/base.css" rel="stylesheet"/>
  <title>登录</title>
</head>
<body>
  <div id="vm" v-cloak>
    <header class="x-header">
      <i class="el-icon-arrow-left x-closewin-icon" @click="closethiswin"></i>
      <div class="x-header-t"></div>
    </header>
    <div class="x-box">
      <div class="x-sound-box">
        <div class="x-sound-time">{{begintimedata}}</div>
      </div>
      <div class="x-sound-tt"><span class="x-sound-icon"></span>正在录音….. <br>（结束后面试录音自动保存至管理后台）</div>
      <div class="x-mana-btn" @click="overface">结束面试</div>
    </div>

  </div>
  <script type="text/javascript" src="./script/vue.js"></script>
  <script type="text/javascript" src="./script/element.js"></script>
  <script type="text/javascript" src="./script/api.js"></script>
  <script type="text/javascript" src="./js/base.js"></script>
  <script>
    apiready = function () {
      //
    var vm = new Vue({
      el:'#vm',
      data(){
        return{
          begintime:0,
          begintimedata:''
        }
      },
      created:function() {
        var that=this;

      },
      mounted:function(){
        var that=this;
        var setval = setInterval(function(){
          that.begintime++;
          that.gettime(that.begintime)
          // that.begintimedata=Math.floor(that.begintime/3600) + ":"+Math.floor(that.begintime/60) + ":" + that.begintime%60
        },1000)

      },
      methods: {
        //
        gettime:function(time){
          var that = this;
          var sTime = parseInt(time);
          var mTime = 0;
          var hTime = 0;
          if(sTime > 60){
            mTime = parseInt(sTime/60);
            sTime = parseInt(sTime%60);
            if(mTime > 60){
              hTime = parseInt(mTime / 60)
              mTime = parseInt(mTime % 60)
            }
          }
            if(sTime >=0 && sTime < 10){
	            that.begintimedata = "0" + parseInt(sTime) + "";
            }else{
                that.begintimedata = "" + parseInt(sTime) + "";
            }
	        if(mTime >= 0 && mTime < 10) {
	        	that.begintimedata = "0" + parseInt(mTime) + ":" + that.begintimedata;
	        }else{
                that.begintimedata = "" + parseInt(mTime) + ":" + that.begintimedata;
            }
	        if(hTime >= 0 && hTime < 10) {
	        	that.begintimedata = "0" + parseInt(hTime) + ":" + that.begintimedata;
	        }else{
                that.begintimedata = "" + parseInt(hTime) + ":" + that.begintimedata;
            }
	        return that.begintimedata;
        },
        overface:function(){
          var that=this;
          // clearInterval(setval)
          api.ajax({
            url:manaurltwo+'end',
            methods:'get',
            data:{
              values:{
                sec: $api.getStorage('usertoken')
              }
            }
          },function(ret,err){
            if(ret){
              api.hideProgress();
              console.log(JSON.stringify(ret));
              if(ret.status == 1){
                api.sendEvent({
                    name: 'overfaceok',
                    extra: {}
                });
                // openmanawin("interviewlist","interviewlist.html")

              }else{
                api.toast({
                    msg: ret.msg,
                    duration: 3000,
                    location: 'bottom'
                });
              }
            }else{
              api.hideProgress();
              console.log(JSON.stringify(err));
              api.toast({
                  msg: err.msg,
                  duration: 3000,
                  location: 'bottom'
              });
            }
          })
        },
      }
    })
    }
  </script>
</body>
</html>
